<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>省市级联</title>
    <script type="text/javascript" src="jquery-1.9.1.js"></script>
</head>
<body>
    <select class="provices"></select>
    <select class="schools"></select>

    <script type="text/javascript">
        $.ajax({
            "url":"/getProvice",
            "type":"GET",
            "dataType":"json"
        }).done(function (data) {
            for (index in data){
                var province = data[index];
                var opt = $("<option value='"+province.id+"'>"+province.name+"</option>");
                $(".provices").append(opt);
            }
            chg();
        }).fail();
        $(".provices").change(chg);

        function chg() {
            $(".schools").empty();
            $.ajax({
                "url":"/getCity",
                "type":"post",
                "data":{"sid":$(".provices").val()},
                "dataType":"json"
            }).done(function (data) {
                for (index in data){
                    $(".schools").append("<option>"+data[index].name+"</option>");
                }
            });
        }


    </script>
</body>
</html>